<%@ page import="com.wanghlme.exercise05.pojo.Emp" %>
<%@ page import="java.util.List" %>
<%@ page import="java.text.SimpleDateFormat" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>--%>
<html>
<head>
    <meta charset="UTF-8">
    <title>主页</title>
    <script src="${pageContext.request.contextPath}/static/js/jquery-3.6.0.min.js" type="text/javascript"></script>
    <style>
        * {
            padding: 0px;
            margin: 0px;
        }

        .container {
            width: 1000px;
            height: 600px;
            display: flex;
            flex-direction: row;
            justify-content: flex-end;
            align-items: center;
        }

        .container-child {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }

        .container-child table,
        .container-child table tr th,
        .container-child table tr td {
            margin: 10px 0 10px 0;
            width: 800px;
            border: 1px solid black;
            font-size: 18px;
            text-align: center;
            collapse: 0px;
        }

        .container-child div button {
            width: 400px;
            height: 100px;
            padding: 10px;
            margin: 10px;
            font-size: 18px;
        }
    </style>
</head>
<body>
<div class="container">
    <div class="container-child">
        <table>
            <thead><h1>欢迎${sessionScope.emp.empName}</h1></thead>
            <tbody>
            <tr>
                <td>编号</td>
                <td>姓名</td>
                <td>登录名</td>
                <td>入职日期</td>
                <td>年龄</td>
                <td colspan="2">操作</td>
            </tr>
            <%--    <c:forEach var="emp" items="${requestScope.empList}">--%>
            <%
                List<Emp> list = (List<Emp>) request.getAttribute("empList");
                for (Emp emp : list) {
            %>
            <tr id="<%=emp.getEmpId()%>">
                <td>
                    <%=emp.getEmpId()%>
                </td>
                <td>
                    <%=emp.getEmpName()%>
                </td>
                <td>
                    <%=emp.getEmpLogin()%>
                </td>
                <td>
                    <%=new SimpleDateFormat("yyyy-MM-dd").format(emp.getEmpHiredate())%>
                </td>
                <td>
                    <%=emp.getEmpAge()%>
                </td>
                <td>
                    <a href="${pageContext.request.contextPath}/delEmp?id=<%=emp.getEmpId()%>">删除</a>
                </td>
            </tr>
            <%
                }
            %>
            <%--    </c:forEach>--%>
            </tbody>
        </table>
        <div>
            <button type="button" id="addBtn">新增</button>
            <script type="text/javascript">
                $().ready(function () {
                    $("#addBtn").on("click", function () {
                        location.replace("${pageContext.request.contextPath}/toAdd")
                    });
                    $("tr:gt(0)").on({
                        "mouseover": function () {
                            this.style.cursor = "pointer";
                            this.style.backgroundColor = "#ff9900";
                        },
                        "mouseout": function () {
                            this.style.cursor = "default";
                            this.style.backgroundColor = "#ffffff";
                        },
                        "dblclick": function () {
                            let id = $(this).attr("id");
                            location.replace("${pageContext.request.contextPath}/toEdit?id=" + id);
                        }
                    })
                });
            </script>
        </div>
    </div>
</div>
</body>
</html>
